<template>
<div>

  <div style="height: 30px; display: flex; justify-content: space-around; margin-top: 2vh;" class="box">
    <van-search style="width:90vw;" v-model="value" placeholder="狂飙" />
  </div>

  <div class="flex px-3" >
<button><span style="word-spacing:8px;letter-spacing: 2px;">书架  书单</span>
</button> <span class="ml-auto">  <button><van-icon  name="passed" /> <span>选择</span></button></span>
  </div>

  <div style="margin: 0 auto; text-align: center; " >
<button><span style="word-spacing:8px;letter-spacing: 2px;">默认  更新  进度  推荐值  分类  付费</span></button>
  </div>

  <div>
    <van-grid :border="false" :column-num="3">
      <van-grid-item>
        <van-image
            :src="require('@/assets/ydshu/1.png')"/>
      </van-grid-item>

      <van-grid-item>
        <van-image
            :src="require('@/assets/ydshu/2.png')"/>
      </van-grid-item>

      <van-grid-item>
        <van-image
            :src="require('@/assets/ydshu/3.png')"/>
      </van-grid-item>

      <van-grid-item>
        <van-image
            :src="require('@/assets/ydshu/1.png')"/>
      </van-grid-item>

      <van-grid-item>
        <van-image
            :src="require('@/assets/ydshu/1.png')"/>
      </van-grid-item>

      <van-grid-item>
        <van-image
            :src="require('@/assets/ydshu/1.png')"/>
      </van-grid-item>

      <van-grid-item>
        <van-image
            :src="require('@/assets/ydshu/1.png')"/>
      </van-grid-item>

      <van-grid-item>
        <van-image
            :src="require('@/assets/ydshu/1.png')"/>
      </van-grid-item>

      <van-grid-item>
        <van-image
            :src="require('@/assets/ydshu/1.png')"/>
      </van-grid-item>

      <van-grid-item>
        <van-image
            :src="require('@/assets/ydshu/1.png')"/>
      </van-grid-item>
      <van-grid-item>
        <van-image
            :src="require('@/assets/ydshu/1.png')"/>
      </van-grid-item>
      <van-grid-item>
        <van-image
            :src="require('@/assets/ydshu/1.png')"/>
      </van-grid-item>
      <van-grid-item>
        <van-image
            :src="require('@/assets/ydshu/1.png')"/>
      </van-grid-item>
    </van-grid>
  </div>

  <div>

  </div>

</div>
</template>

<script>
export default {
  name: "Category"
}
</script>

<style scoped>

</style>
